<script lang="ts" setup>
import { getHealthSX } from '~/api/home'
import bg from 'public/img/banner.png'
const props = defineProps({
  type: {
    type: String,
    default: () => [],
  },
  isBg:{
    type: Boolean, 
    default: false,
  }
})

const inputVal = ref('')
const loading = ref(true)
const dialogVisible = ref(false)
const list = ref<any[]>([])
const searchValue = ref('')
const hotSearch = ref<any[]>([
    "高血压", "糖尿病", "冠心病", "关节炎"
])
// 搜索
function onSearch() {
    searchValue.value = inputVal.value
    // getList()
    console.log(window.location.pathname)
    navigateTo({
        path: `/peopleHealth/advancedSearch`,
        query: {
            data: searchValue.value,
            type:props.type
        },
    })
}
function clearInput() {
    inputVal.value = ''
}
function getHealthSxList() {
    getHealthSX().then((res) => {
        loading.value = false
        list.value = res.data
    }).catch(() => {
        loading.value = false
    })
}
function hotSearchClick(item: any) {
    inputVal.value = item
}
getHealthSxList()
</script>

<template>
    <div class="my-20px">
        <div class="h-20 flex items-center justify-center">
            <div   class="advanced-search-btn" @click="dialogVisible = true" >
<!--                <i class="i-ri:menu-search-line cursor-pointer text-#fff" />-->
                高级搜索
            </div>
        </div>
        <el-dialog v-model="dialogVisible" width="80%" title="" >
           <PublicSearchAll :type="props.type" value="" />
        </el-dialog>
    </div>
</template>

<style>
.advanced-search-btn{
  font-size: 28px;
  font-weight: 700;
  color: #27a280;
  margin-top: 55px;
  cursor: pointer;
  border-bottom: 1px solid #27a280;
  margin-bottom: 50px;
}
</style>
